<template>
<div class="rule-wrap">
    <!-- <van-nav-bar title="分类" left-text="返回" left-arrow fixed @click-left="$router.go(-1)" /> -->

    <van-list
  v-model="loading"
  :finished="finished"
  finished-text="没有更多了"
  @load="onLoad"
>
  <van-cell
    v-for="item in list"
    :key="item"
    :title="item"
  />
</van-list>
    <!-- <van-tabs v-model="category_id">
        <van-tab :title="item.title" v-for="item in category" :key="item.id" @click="getDataIndex(item.id)" >
                <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="getData" >
                        <Goods :data="goodsData" :load="false" :type="2" @getDetail="getDetail" :size="'classify'" />
                    </van-list>

        </van-tab>
    </van-tabs> -->


    
</div>
</template>

<script>
import { Tab, Tabs } from 'vant';
import Axios from 'axios'
import Goods from '@/common/goods/index';
export default {
    name: 'rule',
    data() {
        return {
            type: '',
            category_id: null,
            categoryId: null,
            category: null,
            goodsData: null,
            finished: false,
            loading: true,
            c_page: 1,
            list:[]
        }
    },
    components: {
        Goods
    },
    created() {
        this.categoryId =  this.$route.query.id;
        this.category = this.$store.state.integral_recommend_data;
        this.category.forEach((item, index) => {
            if (item.id == this.$route.query.id) {
                this.category_id = index
            }
        })
        // this.getData();
    },
    methods: {
        onLoad() {
                // 异步更新数据
                setTimeout(() => {
                    for (let i = 0; i < 10; i++) {
                    this.list.push(this.list.length + 1);
                    }
                    // 加载状态结束
                    this.loading = false;

                    // 数据全部加载完成
                    if (this.list.length >= 40) {
                    this.finished = true;
                    }
                }, 500);
                },

        // getData() {
        //     let params = {
        //         token: sessionStorage.getItem('token'),
        //         page: this.c_page
        //     }
        //     Axios.get('/api/store/index/data/' + this.categoryId, {
        //         params
        //     }).then(r => {
        //         if(r.data.data.current_page <= r.data.data.last_page){
        //           this.c_page = r.data.data.current_page +1;
        //           if(r.data.data.current_page == 1){
        //             this.goodsData = r.data.data.data
        //           }else {
        //             this.goodsData = [...this.goodsData,...r.data.data.data]
        //           }
        //           this.loading = true;
        //         }else {
        //           this.loading = false;
        //           this.finished = true;
        //         }
        //     }).catch(e => {
        //         console.log(e);
        //     })
        // },
        getDetail(e, type) {
            this.global.state.productStore_goods = e;
            this.$router.push({
                name: 'productIntegral',
                path: '/product/integral'
            })
            
            
        },
        getDataIndex(id){
          console.log(this.loading,this.finished);
          if(id != this.category_id){
            this.categoryId = id;
            this.loading = true;
            this.finished = false;
            this.c_page = 1;
            this.getData();
          }
        }
    }
}
</script>

<style scoped>
.rule-wrap {
    padding: 50px 0 0 0;
}

.left {
    top: 50px;
    left: 0;
    bottom: 0;
    overflow-y: auto;
}

.right {
    top: 50px;
    right: 0;
    width: calc(100% - 90px);
    bottom: 0;
    background: #fff;
    overflow-y: auto;
}
</style>
